<!DOCTYPE html>
<html>
<head>
    <title>人员管理</title>
    <style type="text/css" >
        html {
            background: url("/img/bg.png") no-repeat center center fixed;
            background-size: cover;
        }
        body {
            text-align: center;
        }
        h2 {
            margin-top: 30px;
            color: white;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="/css/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/css/themes/icon.css">
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/jquery.easyui.min.js"></script>
    <script src="/js/jquery.cookie.js"></script>
</head>
<body>
<h2>我的信息</h2>
<center>
    <table id="dg" align="center" class="easyui-datagrid" title="项目列表" style="width: 700px;height:auto"
           data-options="
				iconCls: 'icon-edit',
				singleSelect: true,
				toolbar: '#tb',
				onClickRow: onClickRow"
           url="/employee/allEmployee.do"
           rownumbers="true" pagination="true">
        <thead>
        <tr>
            <th data-options="field:'id',width:100">员工编号</th>
            <th data-options="field:'name',width:100,
                      editor:{
                              type:'textbox',
                              options:{
                                required:true
                              }
                      }">名字</th>
            <th data-options="field:'password',width:100,
                      editor:{
                              type:'textbox',
                              options:{
                                required:true
                              }
                      }">密码</th>
            <th data-options="field:'gender',width:100,
                      editor:{
                              type:'combobox',
                              options:{
                                required:true,
                                valueField:'gender',
                                textField:'gender',
                                data:[{gender:'F'},{gender:'M'}]
                              }
                      }">性别</th>
            <th data-options="field:'age',width:80,editor:'textbox'">年龄</th>
            <th data-options="field:'birthday',width:100, editor:'datebox'">生日</th>
        </tr>
        </thead>
    </table>
</center>
<div id="tb" style="height:auto">
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-save',plain:true" onclick="accept()">保存</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-undo',plain:true" onclick="reject()">还原</a>
</div>
<script type="text/javascript">
    var editIndex = undefined;
    var del = new Array();
    function endEditing(){
        if (editIndex == undefined){return true}
        if ($('#dg').datagrid('validateRow', editIndex)){
            $('#dg').datagrid('endEdit', editIndex);
            editIndex = undefined;
            return true;
        } else {
            return false;
        }
    }
    function onClickRow(index){
        if (editIndex != index){
            if (endEditing()){
                $('#dg').datagrid('selectRow', index)
                        .datagrid('beginEdit', index);
                editIndex = index;
            } else {
                $('#dg').datagrid('selectRow', editIndex);
            }
        }
    }
    function accept(){
        if (endEditing()){
            var rows = $('#dg').datagrid('getChanges');
            postChange(rows);
            $('#dg').datagrid('acceptChanges');
        }
    }
    function reject(){
        $('#dg').datagrid('rejectChanges');
        editIndex = undefined;
    }
    function postChange(rows){
        if(rows){
            var newRows = createPosts(rows);
            postRows(newRows);
        }
    }
    function createPosts(rows){
        var newRows = new Array();
        for(var i = 0; i < rows.length; i++) {
            for(var j = 0; j < del.length; j++) {
                if(rows[i].id == del[j]) break;
            }
            if(j == del.length) newRows.push(rows[i]);
        }
        return newRows;
    }
    function postRows(rows){
        if(rows) {
            $.ajax({
                type:"POST",
                contentType:"application/json",
                url:"/employee/addOrUpdateEmployees.do",
                data:JSON.stringify(rows),
                success:function(data){
                    var obj = eval('(' + data + ')');
                    if(obj.status != "success"){
                        alert(obj.msg);
                        reject();
                    }
                },
                error:function(XMLHttpRequest, textStatus, errorThrown) {
                    alert(XMLHttpRequest.status + ':' + textStatus);
                }
            });
        }
    }
    function allPrpos ( obj ) {
        // 用来保存所有的属性名称和值
        var props = "" ;
        // 开始遍历
        for ( var p in obj ){ // 方法
            if ( typeof ( obj [ p ]) == " function " ){ obj [ p ]() ;
            } else { // p 为属性名称，obj[p]为对应属性的值
                props += p + " = " + obj [ p ] + " /t " ;
            } } // 最后显示所有的属性
        alert ( props ) ;
    }
</script>
<link rel="stylesheet" type="text/css" href="/css/custom.css">
<div id="footer">
    <ul>
        <li>
            <div class="cell">
                <a href="/project/list.do">项目</a>
            </div>
        </li>
        <li>
            <div class="cell">
                <a href="/task/list.do">任务</a>
            </div>
        </li>
        <li>
            <div class="cell">
                <a href="/employee/manageEmployee.do">我的</a>
            </div>
        </li>
    </ul>
</div>
</body>
</html>
